feat(grid): style inputs in the context of cell #16451
Conversation
There was a problem hiding this comment.
Pull Request Overview
This PR adds styling overrides for input components within grid cells to ensure proper visual integration. The changes apply to various Ignite UI input components (input-group, combo, select, date/time pickers) to make them display correctly within the grid cell context.
Key changes:
- Extends cell input overrides placeholder
- Sets height to 'auto' for multiple input component types within cells
- Applies transparent background to igx-input-group components
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
simeonoff
requested review from
desig9stein
and removed request for
simeonoff
adrianptrv
added
the
✅ status: verified
| @@ -1192,6 +1192,21 @@ | |||
| align-items: center; | |||
| outline-style: none; | |||
|
|
|||
| @extend %cell-input-overrides; | |||
There was a problem hiding this comment.
Since you are extending this here, you can remove that same extend from igx-grid-td--editing since the base class igx-grid_td is always present
|
I try to create a global theme for the simple combo, and I noticed this visual behavior. Use this theme to test: igx-simple-combo {
@include css-vars-from-theme(
$theme: combo-theme(
$schema: $schema,
$toggle-button-background: red,
$toggle-button-foreground: green,
),
$name: 'ig-combo',
);
}
There are some rules with an important flag on them; we have to handle this in the overrides |
|
@simeonoff @sdimchevski I fixed the disabled states for the combo and input in the context of grid cell to use the But I have a question - for the idle state of the toggle button, should it be using it's own |
Closes #16360
Additional information (check all that apply):
Checklist:
feature/README.MDupdates for the feature docsREADME.MDCHANGELOG.MDupdates for newly added functionalityng updatemigrations for the breaking changes (migrations guidelines)